<template>
	<div class="uplist">
		<div style="display: flex;">
			<div class="picture"><img :src="`http://127.0.0.1/api/public/showimg/${arr.pic}`" />
				图片:<input type="file" ref="imgs" id="pic">
				<hr>
			</div>
			<div class="in">
				<el-form :model="arr" ref="arr" label-width="100px" class="demo-ruleForm">
					<el-form-item label="书籍名称" prop="name">
						<el-input v-model="arr.name"></el-input>
					</el-form-item>
					<el-form-item label="书籍序号" prop="region">
						<el-input v-model="arr.sn"></el-input>
						</el-select>
					</el-form-item>
					<el-form-item label="书籍价格" prop="region">
						<el-input v-model="arr.price"></el-input>
						</el-select>
					</el-form-item>
					<el-form-item label="书籍出版社" prop="region">
						<el-input v-model="arr.maker"></el-input>
						</el-select>
					</el-form-item>
					<el-form-item label="书籍作者" prop="region">
						<el-input v-model="arr.author"></el-input>
						</el-select>
					</el-form-item>
					<el-form-item label="出版时间" required>
						<el-col :span="11">
							<el-form-item prop="date1">
								<el-date-picker type="date" placeholder="选择日期" v-model="arr.date" style="width: 100%;">
								</el-date-picker>
							</el-form-item>
						</el-col>
					</el-form-item>
					<el-form-item label="书籍库存" prop="region">
						<el-input v-model="arr.stock"></el-input>
						</el-select>
					</el-form-item>
					<!-- <el-form-item label="商品类型">
						<el-cascader :options="options" :show-all-levels="false" />
					</el-form-item> -->
					<el-form-item label="书籍详情" prop="info">
						<el-input type="textarea" :rows="2" placeholder="请输入内容" v-model="arr.info">
						</el-input>
					</el-form-item>
					<el-button type="primary" @click="submitForm('arr')">立即修改</el-button>
				</el-form>
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		name: 'UpdateMovList',
		data() {
			return {
				arr: {},
				type: [],
			}
		},
		methods: {
			submitForm(formName) {
				this.$refs[formName].validate((valid) => {
					if (valid) {
						let fd = new FormData();
						let content = this.$refs.imgs.files[0];
						fd.append("mypic", content);
						fd.append("id", this.arr.id)
						fd.append("name", this.arr.name)
						fd.append("sn", this.arr.sn)
						fd.append("price", this.arr.price)
						fd.append("memo", this.arr.info)
						fd.append("author", this.arr.author)
						// fd.append("tmake",this.arr.tmake)
						fd.append("stock", this.arr.stock)
						fd.append("maker", this.arr.maker);
						console.log(fd);
						this.$postf("/api/adm/book/add", fd).then((resp) => {
							console.log(resp.data.data);
							this.arr = resp.data.data
						})
					} else {
						console.log('error submit!!');
						return false;
					}
				});
				this.$router.push('/home/list');
			},
			
		},
		mounted() {
			this.arr = this.$route.query.arr;
		}
	}
</script>

<style scoped>
	.uplist {
		width: 85%;
	}
	.picture img{
		width: 30%;
		height: 60%;
	}
</style>
